import React from 'react';
import {View, WebView, StyleSheet, Dimensions} from 'react-native';
import PropTypes from 'prop-types';
import fetch from 'sx-fetch/src';



const {width, height} = Dimensions.get('window');

@fetch.inject()
export default class CopyText extends React.Component {

  static defaultProps = {
    renderText: '',
    textSize: 14,
    textColor: '#000',
  };

  static propTypes = {
    renderText: PropTypes.string.isRequired,
  }

  render() {
    const {renderText, textSize, textColor} = this.props;
    const html = `<p style="width: 100%;height:10px;font-size: ${textSize}px; color: ${textColor}">${renderText}</>`;

    return (
        <WebView
          ref={(ref)=>this.webRef = ref}
          injectJavaScript={()=>{
            this.webRef.injectJavaScript()
          }}
          style={{width: width,height:textSize*2}}
          source={{html: html, baseUrl: ''}}
          dataDetectorTypes={'all'}
        />
    )
  }
}


const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
  },
});
